<template>
  <div>
    <TopInfo />
    <ElRow class="main-row">
      <ElCol :span="10"> <HotItem /></ElCol>
      <ElCol :span="14"><HotAct /></ElCol>
    </ElRow>
    <ElRow class="main-row">
      <ElCol :span="10"> <HotUser /></ElCol>
      <ElCol :span="14"> <Notice /></ElCol>
    </ElRow>
  </div>
</template>

<script>
import TopInfo from '@/components/main/TopInfo.vue';
import HotItem from '@/components/main/HotItem.vue';
import HotUser from '@/components/main/HotUser.vue';
import HotAct from '@/components/main/HotAct.vue';
import Notice from '@/components/main/Notice.vue';

export default {
  name: 'Main',
  components: {TopInfo, HotItem, HotUser, HotAct, Notice}
};
</script>

<style lang="scss">
.main-row {
  margin-bottom: 20px;
}
</style>
